<template>
	<view class="cont" @click="onGoTicket(item.id)">
		<view class="title">{{item.title}}</view>
		<view class="info">{{item.visual_describe}}</view>
		<view class="desc">
			<text class="price">价格：￥{{item.bid_price}}</text>
			<text class="money">会员价格：￥{{ (item.bid_price, item.vip_price) | vip_price(item.bid_price, item.vip_price ) }}</text>
			<text class="btn cu-btn radius shadow bg-green">交易</text>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			item: {
				type: Object,
				default: null
			}
		},
		data() {
			return {
				
			};
		},
		filters: {
			vip_price(bid_price, vip_price) {
				return (Number(bid_price) + Number(vip_price)).toFixed(2)
			}
		},
		methods: {
			onGoTicket(id) {
				uni.navigateTo({
					url: `/pages/Shops/Ticket/Ticket?id=${id}`
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.cont{
		margin: 30upx;
		margin-top: 0;
		padding: 30upx 50upx;
		background-color: #fff;
		box-shadow: 0 10upx 50upx 0 rgba(0,0,0,0.1);
		position: relative;
		overflow: hidden;
		&::before,
		&::after{
			content: '';
			position: absolute;
			top: 0;
			bottom: 0;
			margin: auto;
			width: 40upx;
			height: 40upx;
			border-radius: 40upx;
			background-color: rgba(#000, .05);
		}
		&::before{
			left: -20upx;
		}
		&::after{
			right: -20upx;
		}
		.title{
			font-size: 30upx;
			color: #000;
			line-height: 42upx;
			padding-bottom: 19upx;
			border-bottom: 1upx dashed #ccc;
		}
		.info{
			margin: 20upx 0;
			font-size: 24upx;
			color: #333;
			line-height: 33upx;
		}
		.desc{
			display: flex;
			justify-content: space-between;
			align-items: center;
			.money{
				font-size: 26upx;
				color: #FF3401;
				line-height: 37upx;
			}
			.price{
				font-size: 26upx;
				color: #FFBD00;
				line-height: 37upx;
			}
			.btn{
				width: 114upx;
				height: 50upx;
				border-radius: 8upx;
				padding: 0;
				font-size: 26upx;
			}
		}
	}
</style>
